<template>
  <el-col :span="24">

    <el-row>
      <div align="center"><h1>K8S 冒泡服务重启(restart)</h1></div>
    </el-row>

    <el-row>
      <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
      <el-col :span="4"><div class="grid-content">
        <h2>1.重启</h2></div>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
      <el-col :span="20"><div class="grid-content">
                           <h4>选择需重启的应用:</h4></div>
        <el-select v-model="value" style="width:100%" filterable placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
        <br><br>

        <el-button type="success" style="width:20%" icon="el-icon-top" @click="sumbit">提交</el-button>
      </el-col>

    </el-row>

    <el-row>
      <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
      <el-col :span="20">
        <!-- <div class="grid-content">
  <h4>image地址:</h4></div>
  <el-input v-model="image" placeholder="请输入内容"></el-input>
  <br><br>
  <el-button type="primary" style="width:20%"  @click="sumbit" icon="el-icon-top">提交</el-button>
  <br><br>
  <div class="grid-content" v-html="message2" v-highlight></div> -->
        <!--
  <div v-show="play" v-highlight>
      <pre><code v-html="message2">

        </code></pre>
  </div> -->

        <div v-show="play" v-highlight>
          <pre><code class="javascript" v-html="message2" /></pre>
        </div>

      </el-col>
    </el-row>

    <el-row>
      <el-col :span="2"><div class="grid-content">&nbsp;</div></el-col>
      <el-col :span="20"><div class="grid-content">
                           <h2>2.查看</h2></div>
        <el-button-group>
          <!-- <el-button type="primary" icon="el-icon-check" @click="k8s_dep_logs_vue">查看部署日志(多次点击即刷新)</el-button> -->
          <el-button type="success" icon="el-icon-date" @click="k8s_show_pods_vue">查看pod信息</el-button>
          <el-button type="success" icon="el-icon-document-copy" @click="k8s_show_describe_vue">查看describe信息</el-button>
          <el-button type="success" icon="el-icon-printer" @click="k8s_show_dep_logs_vue">启动后查看应用日志</el-button>
        </el-button-group>

        <div v-show="play1" v-highlight>
          <pre><code class="javascript" v-html="message1" /></pre>
        </div>

      </el-col>
    </el-row>

  </el-col>

</template>

<script>
// import  qs from 'qs'
import { restartpod, mopo_pod_list, k8s_show_pods_vue_mopo, k8s_show_describe_vue_mopo, k8s_show_dep_logs_vue_mopo } from '@/api/query'

export default {
  data() {
    return {
      options: [{
        value: '1',
        label: '数据加载中请稍后'
      }],
      value: '',
      image: '',
      message2: '',
      message1: '',
      play: false,
      play1: false,
      namespace: 'mopo'
    }
  },

  computed: {
    GetUser() {
      return this.$store.state.user
    }
  },
  created() {
    this.MopoPodList()
  },
  methods: {
    MopoPodList() {
      mopo_pod_list().then(response => {
        // console.log(response.data)
        this.options = response.data
      })
    },
    sumbit() {
      this.play = true
      restartpod({ 'value': this.value, 'namespace': this.namespace }).then(response => {
        // console.log(response.data)
        this.message2 = response.data.log,
        this.value = response.data.podname
      })
    },
    k8s_show_pods_vue() {
      this.play1 = true
      k8s_show_pods_vue_mopo({ 'aa': this.value, 'bb': this.namespace }).then(response => {
        // console.log(response.data)
        this.message1 = response.data
      })
    },
    k8s_show_describe_vue() {
      this.play1 = true
      k8s_show_describe_vue_mopo({ 'aa': this.value, 'bb': this.namespace }).then(response => {
        // console.log(response.data)
        this.message1 = response.data
      })
    },
    k8s_show_dep_logs_vue() {
      this.play1 = true
      k8s_show_dep_logs_vue_mopo({ 'aa': this.value, 'bb': this.namespace }).then(response => {
        // console.log(response.data)
        this.message1 = response.data
      })
    }
    // fromget(){
    //     this.$axios.get("/sun/api/mopo_pod_list")
    //     .then(res => {
    //       console.log(res.data.ret);
    //       this.options = res.data.ret
    //     })
    //     .catch(error => {
    //       console.log(error);
    //     })
    //   },

  }
//   mounted() {
//     window.addEventListener('load', () => {
//           if (this.$route.path !== '/') {
//                 this.$router.replace('/')
//           }
//     })
// }
}
</script>

<style scoped>
.el-col {
  min-height: 1px
}
</style>
